<template>
  <div class="limitdivc">
    <el-form
      :label-position="labelPosition"
      label-width="100px"
      :rules="rules"
      ref="carmanage"
      class="demo-ruleForm"
      :model="carmanage"
    >
      <el-row>
        <el-col :span="12">
          <el-form-item label="车辆管理单号">
            <el-input v-model="carmanage.manageCarId" disabled></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="12">
          <el-form-item label="业主姓名">
            <el-input v-model="owner_name" disabled></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row>
        <el-col :span="12">
          <el-form-item label="业主车牌号" prop="ownerCar">
            <el-input v-model="carmanage.ownerCar" placeholder="如：京A·00000" ></el-input>
          </el-form-item>
        </el-col>

        <!-- <el-col :span="12">
          <el-form-item label="停车位">
            <el-input v-model="carmanage.ownerParkingId" disabled></el-input>
          </el-form-item>
        </el-col> -->
      </el-row>
      <br />
      <el-form-item>
        <el-button
          class="buttenstylec"
          type="primary"
          v-if="isaddcar"
          @click="submitForm('carmanage')"
        >添加汽车</el-button>
      </el-form-item>
      <el-form-item>
        <el-button
          class="buttenstylec"
          type="primary"
          v-if="updatecar"
          @click="submitForm('carmanage')"
        >修改车牌号</el-button>
      </el-form-item>
    </el-form>

    <el-dialog title="提示" :visible.sync="dialogVisible_car" width="30%" :before-close="handleClose">
      <pre>
        尊敬的业主，您还没有爱车登记在册哦！
        如若需要，请自行添加，谢谢！
      </pre>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible_car = false">取 消</el-button>
        <el-button type="primary" @click="dialogVisible_car = false">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog
      title="提示"
      :visible.sync="dialogVisible_parking"
      width="30%"
      :before-close="handleClose"
    >
      <pre>
        尊敬的业主，您还没有停车位哦！
        如若需要，请联系物业管理员，谢谢！
      </pre>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible_parking = false">取 消</el-button>
        <el-button type="primary" @click="dialogVisible_parking = false">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
export default {
  data() {
    return {
      isaddcar: false,
      dialogVisible_car: false,
      dialogVisible_parking: false,
      updatecar:true,
      labelPosition: "right",
      owner_name: "",
      ownerId: "",
      carmanage: {
        manageCarId: "",
        ownerCar: "",
        ownerParkingId: ""
      },
      rules: {
        ownerCar: [
          {
            pattern:
              "^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[·]{1}[警京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼]{0,1}[A-Z0-9]{4}[A-Z0-9挂学警港澳]{1}$",
            message: "请输入正确的车牌号！"
          }
        ]
      }
    };
  },
  methods: {
    handleClose(done) {
      this.$confirm("确认关闭？")
        .then(_ => {
          done();
        })
        .catch(_ => {});
    },
    submitForm(formName) {
      this.$refs[formName].validate(valid => {
        if (valid) {
          console.log(this.carmanage);
          this.axios
            .post("managecar/addcar", this.carmanage)
            .then(res => {
              console.log(res);
              if (res.data == "success") window.location.reload();
            })
            .catch(err => {
              console.error(err);
            });
        } else {
          console.log("error submit!!");
          return false;
        }
      });
    }
  },
  created() {
    this.owner_name = sessionStorage.getItem("userName");
    this.ownerId = sessionStorage.getItem("userId");
    this.axios
      .post("managecar/managecar?ownerId=" + this.ownerId)
      .then(res => {
        this.carmanage = res.data;
        if (this.carmanage.ownerCar == "" || this.carmanage.ownerCar == null) {
          this.dialogVisible_car = true; //登记汽车
          this.isaddcar = true;
          this.updatecar=false;
        } else if (
          (this.carmanage.ownerCar != null || this.carmanage.ownerCar != "") &&
          (this.carmanage.ownerParkingId == "" ||
            this.carmanage.ownerParkingId == null)
        ) {
          // this.dialogVisible_parking = true; //停车位
          
        }
      })
      .catch(err => {
        console.error(err);
      });
  },
  components: {}
};
</script>

<style scope>
</style>
